<template>
  <el-row>
    <el-col :span="24">
      <el-form :inline="true" :model="materialSearchObj" class="search_prod tl">
        <el-form-item>
          <el-input
            size="small"
            clearable
            v-model="materialSearchObj.username"
            style="width: 150px"
            placeholder="用户账号"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-input
            size="small"
            clearable
            v-model="materialSearchObj.nickname"
            style="width: 150px"
            placeholder="用户昵称"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-input
            size="small"
            clearable
            v-model="materialSearchObj.tel"
            style="width: 150px"
            placeholder="手机号码"
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-row class="tl">
            <el-col :span="24">
              <el-button
                :loading="$store.state.isLoading"
                size="small"
                class="top_weiy"
                type="primary"
                @click="onSubmit"
                >查询</el-button
              >
              <el-button
                :loading="$store.state.isLoading"
                size="small"
                class="top_weiy"
                type="primary"
                @click="delSubmit"
                >一键清除</el-button
              >
            </el-col>
          </el-row>
        </el-form-item>
      </el-form>
    </el-col>
  </el-row>
</template>
<script>
export default {
  props: {},
  data() {
    return {
      materialSearchObj: {
        username: "",
        nickname: "",
        tel: "",
      },
    };
  },
  methods: {
    delSubmit() {
      this.materialSearchObj = {
        username: "",
        nickname: "",
        tel: "",
      };
      this.$emit("sendSearch", this.materialSearchObj);
    },
    onSubmit() {
      this.$emit("sendSearch", this.materialSearchObj);
    },
  },
};
</script>
